<template>
	<view class="add-contract-base-info-box">
		<view class="add-form-box">
			<view class="form-item">
				<view class="title">项目编号</view>
				<input class="uni-input" placeholder="项目编号必填" v-model="projectEntity.projectNumber" />
			</view>
			<view class="form-item">
				<view class="title">项目名称</view>
				<input class="uni-input" placeholder="项目名称必填" v-model="projectEntity.projectName" />
			</view>
			<view class="form-item">
				<view class="title">业主名称</view>
				<view style="display: flex;align-items: center;" @click="loadModal(1)">
					<input class="uni-input" placeholder="请选择业主" v-model="companyName" disabled />
					<uni-icons type="right" size="16" style="color: #666;"></uni-icons>
				</view>
			</view>
			<view class="form-item">
				<view class="title">项目经理</view>
				<view style="display: flex;align-items: center;" @click="loadModal(5)">
					<input class="uni-input" placeholder="请选择项目经理" v-model="userName" disabled />
					<uni-icons type="right" size="16" style="color: #666;"></uni-icons>
				</view>
			</view>
			<view class="form-item">
				<view class="title">合同交货日期</view>
				<uni-datetime-picker type="date" class="uni-input" placeholder="请选择合同交货日期" :clear-icon="false"
					v-model="projectEntity.deliveryTime" />
			</view>
			<view class="form-item">
				<view class="title">预交货日期</view>
				<uni-datetime-picker type="date" class="uni-input" placeholder="请选择预交货日期" :clear-icon="false"
					v-model="projectEntity.preDeliveryTime" />
			</view>
			<view class="form-item">
				<view class="title">产品名称</view>
				<input class="uni-input" placeholder="产品名称必填" v-model="projectEntity.productName" />
			</view>
			<view class="form-item">
				<view class="title">项目开始时间</view>
				<uni-datetime-picker type="date" class="uni-input" placeholder="请选择项目开始时间" :clear-icon="false"
					v-model="projectEntity.startTime" />
			</view>
			<view class="form-item">
				<view class="title">项目结束时间</view>
				<uni-datetime-picker type="date" class="uni-input" placeholder="请选择项目开始时间" :clear-icon="false"
					v-model="projectEntity.endTime" />
			</view>
			<view class="form-item">
				<view class="title">所属合同</view>
				<view style="display: flex;align-items: center;" @click="loadModal(2)">
					<input class="uni-input" placeholder="请选择所属合同" v-model="contractTitle" disabled />
					<uni-icons type="right" size="16" style="color: #666;"></uni-icons>
				</view>
			</view>
			<view class="form-item">
				<view class="title">数量</view>
				<input class="uni-input" placeholder="请输入数量" v-model="projectEntity.number" />
			</view>
			<view class="form-item">
				<view class="title">设备种类</view>
				<view style="display: flex;align-items: center;" @click="loadDeviceTypeEntities">
					<input class="uni-input" placeholder="请选择设备种类" v-model="deviceType.typeName" disabled />
					<uni-icons type="right" size="16" style="color: #666;"></uni-icons>
				</view>
			</view>
			<view class="form-radio-item" style="border-bottom: none;">
				<view class="title">项目状态</view>
				<radio-group @change="radioChangeStatus">
					<label class="uni-list-cell uni-list-cell-pd" v-for="(item, index) in statusEntities"
						:key="item.id">
						<view>
							<radio :value="item.id" color="#3f8cf7" :checked="index === currentRadioStatus"
								style="transform: scale(0.7)" />
						</view>
						<view>{{ item.label }}</view>
					</label>
				</radio-group>
			</view>
			<!-- <view class="form-item">
				<view class="title">项目所在地</view>
				<input class="uni-input" placeholder="发票说明" v-model="projectEntity.provinceId" />
			</view> -->
			<button style="margin: 20rpx" type="primary" @click="saveProject">
				保存
			</button>
		</view>
		<!-- 选择合同 -->
		<view class="bottom-modal-box">
			<uni-popup ref="popup" background-color="#fff">
				<view class="popup-content">
					<view class="item" v-for="data in dataEntities" @click="loadModalValue(data)">
						{{data.title}}
					</view>
				</view>
			</uni-popup>
		</view>
		<!-- 设备类别 -->
		<view class="bottom-modal-box">
			<uni-popup ref="deviceType" background-color="#fff">
				<view class="popup-content">
					<view class="item" v-for="data in deviceTypeEntities" @click="loadDeviceTypeValue(data)">
						{{data.typeName}}
					</view>
				</view>
			</uni-popup>
		</view>
	</view>
</template>

<script>
	import {
		api,
		post
	} from '@/util/api.js'
	export default {
		props: {
			flag: 0, // 1销售合同 2采购合同
			id: '', // 修改时的合同Id
		},
		data() {
			return {
				projectEntity: {
					status: 0
				},
				dataEntities: [],
				type: 0,
				userName: '', // 选中的项目经理
				companyName: '', // 选中的业主名称
				contractTitle: '', // 合同
				currentRadioStatus: 0, // 当前选择是否拿到/开具发票
				statusEntities: [{
						id: '0',
						label: '未开始',
						checked: 'true',
					},
					{
						id: '1',
						label: '执行中'
					},
					{
						id: '2',
						label: '已完成'
					},
					{
						id: '3',
						label: '已结算'
					},
				],
				// 设备类别列表
				deviceTypeEntities: [],
				deviceType: {}, // 选中的设备类别
			}
		},
		created() {
			if (this.id) {
				this.querySingle()
			}
		},
		methods: {
			async querySingle() {
				let result = await post(api.ProjectSingle, {
					id: this.id
				})
				this.projectEntity = result.data
				this.currentRadioStatus = result.data.status
				if (result.data.pmUserId) {
					post(api.UserSingle, {
						id: result.data.pmUserId
					}).then(res => {
						this.userName = res.data.name
					})
				}
				if (result.data.partnerId) {
					post(api.PartnerSingle, {
						id: result.data.partnerId
					}).then(res => {
						this.companyName = res.data==null?null:res.data.companyName
					})
				}
				if (result.data.deviceTypeId) {
					post(api.DeviceTypeSingle, {
						id: result.data.deviceTypeId
					}).then(res => {
						this.deviceType = res.data
					})
				}
				if (result.data.contractId) {
					post(api.ContractSingle, {
						id: result.data.contractId
					}).then(res => {
						this.contractTitle = res.data==null?null:res.data.contractTitle
					})
				}
			},
			saveProject() {
				if (this.projectEntity.projectNumber == '' || this.projectEntity.projectNumber == undefined) {
					return uni.showToast({
						icon: 'none',
						title: '项目编号不能为空'
					})
				}
				if (this.projectEntity.projectName == '' || this.projectEntity.projectName == undefined) {
					return uni.showToast({
						icon: 'none',
						title: '项目名称不能为空'
					})
				}
				if (this.projectEntity.deliveryTime == '' || this.projectEntity.deliveryTime == undefined) {
					return uni.showToast({
						icon: 'none',
						title: '交货日期不能为空'
					})
				}
				if (this.projectEntity.productName == '' || this.projectEntity.productName == undefined) {
					return uni.showToast({
						icon: 'none',
						title: '产品名称不能为空'
					})
				}
				// 保存，跳转下一页
				this.projectEntity.isUsed = 1
				let url = this.id ? api.UpdateProject : api.SaveProject
				post(url, this.projectEntity).then(res => {
					if (res.code == '000000') {
						uni.$emit('reloadAddProject')
					} else {
						uni.showToast({
							icon: 'error',
							title: '提交失败'
						})
					}
				})
			},
			// 打开加载页面
			loadModal(type, flag) {
				this.type = type
				this.dataEntities = []
				if (type == 1) {
					this.queryPartner(type)
				} else if (type == 2) {
					this.queryContract(type)
				} else if (type == 5) {
					this.queryUser(type)
				}
				this.$refs.popup.open('bottom')
			},
			// 查询业主
			queryPartner(type) {
				let that = this
				post(api.PartnerEntities, {
					companyRole: 2
				}).then(res => {
					res.data.forEach(function(item, index) {
						let data = {}
						data.id = item.id
						data.title = item.companyName
						that.dataEntities.push(data)
					})
				})
			},
			// 查询项目经理
			queryUser(type) {
				let that = this
				post(api.UserEntities, {}).then(res => {
					res.data.forEach(function(item, index) {
						let data = {}
						data.id = item.id
						data.title = item.name
						that.dataEntities.push(data)
					})
				})
			},
			// 查询合同
			queryContract(type) {
				let that = this
				post(api.ContractEntities, {}).then(res => {
					res.data.forEach(function(item, index) {
						let data = {}
						data.id = item.id
						data.title = item.contractTitle
						that.dataEntities.push(data)
					})
				})
			},
			// 点击弹框中的选项，返回给输入框
			loadModalValue(data) {
				if (this.type == 1) {
					this.projectEntity.partnerId = data.id
					this.companyName = data.title
				} else if (this.type == 5) {
					this.projectEntity.pmUserId = data.id
					this.userName = data.title
				} else if (this.type == 2) {
					this.projectEntity.contractId = data.id
					this.contractTitle = data.title
				}
				this.$refs.popup.close()
			},
			// 加载设备列表列表
			loadDeviceTypeEntities() {
				post(api.DeviceTypeEntities, {}).then(res => {
					this.deviceTypeEntities = res.data
				})
				this.$refs.deviceType.open('bottom')
			},
			// 点击选中设备类别
			loadDeviceTypeValue(data) {
				this.deviceType = data
				this.projectEntity.deviceTypeId = data.id
				this.$refs.deviceType.close()
			},
			// radio单选
			radioChangeStatus: function(evt) {
				for (let i = 0; i < this.statusEntities.length; i++) {
					if (this.statusEntities[i].id === evt.detail.value) {
						this.currentRadioStatus = i
						this.projectEntity.status = i
						break
					}
				}
			},
		}
	}
</script>

<style>
	@import '@/static/css/AddProjectBaseInfo.css';
</style>